<body>
    <h4>Actualiza Parque-Automotor</h4>
    <br /><br />
    <div id="mytabs">
        <ul id="tablist">
            <li id="tabs-1-tab"><a href="#tabs-1">Datos Parque</a></li>
        </ul>
        <div id="tabs-1">
            <table align="center">
                <tr>
                    <td>
                        Fecha
                    </td>
                    <td>
                        <input name="fecha" id="fecha"/>
                    </td>
                </tr>
                <tr>
                    <td>
                        Hora
                    </td>								
                    <td>
                        <input name="hora" id="hora"/>
                    </td>
                </tr>
                <tr>
                    <td>
                        Status
                    </td>								
                    <td>
                        <select name="status" id="status" style="width: 182px">
                            <option value="selecione">selecione</option>
                            <option value="operativo">operativo</option>
                            <option value="averiado">averiado</option>
                            <option value="en taller">en taller</option>
                            <option value="otro">otro</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td>
                        Comentarios
                    </td>								
                    <td>
                        <input name="descripcion" id="descripcion"/>
                    </td>
                </tr>
                <tr>
                    <td>
                        Placa del Funcionario
                    </td>								
                    <td>
                        <input name="placa_funcionario" id="placa_funcionario"/>
                    </td>
                </tr>
                <tr>
                    <td>
                        Placa Vehiculo
                    </td>								
                    <td>
                        <input name="placa_vehiculo" id="placa_vehiculo"/>
                    </td>
                </tr>
                
                <tr>
                    <td>
                        <p>
                            <span class="art-button-wrapper">
                                <span class="art-button-l"> </span>
                                <span class="art-button-r"> </span>
                                <a style="cursor: pointer;" class="art-button" href="javascript:guardar()">Actualizar</a>
                            </span>
                        </p>
                    </td>
                    <td>
                        <p>
                            <span class="art-button-wrapper">
                                <span class="art-button-l"> </span>
                                <span class="art-button-r"> </span>
                                <a class="art-button" style="cursor: pointer;" href="javascript:limpiar()">Limpiar</a>
                            </span>
                        </p>
                    </td>
                </tr>
            </table>
            <div id="respuesta"></div> 

        </div>
    </div>
    <script>
      
        function guardar(){			
            console.log(">>>" + $("#placa_funcionario").get(0).value);
            //Con jquery obtengo los id de cada input que estan en mi pagina html.
            var params = {fecha: $("#fecha").get(0).value,
                hora: $("#hora").get(0).value,
                status: $("#status").get(0).value,
                descripcion: $("#descripcion").get(0).value,
                placa_funcionario: $("#placa_funcionario").get(0).value,
                placa_vehiculo: $("#placa_vehiculo").get(0).value, 
                accion: 'actualizar'
            }			
            $("#respuesta").load("../controladores/ParqueAutomotorControlador.php", params, function(){	
                
                console.log("recibidos los datos por ajax");
            });
        }
        //Este codigo define el calendario en el formulario
        $("#fecha" ).datepicker({
            showOn: "button",
            buttonImage: "../images/calendar.gif",
            buttonImageOnly: true,
            changeMonth: true,
            changeYear: true
        });
        //Este codigo define el tab en el formulario
        $("#mytabs" ).tabs();
	
    </script>  
</body>
